<template>
  <el-dialog title="发货111" :visible.sync="dialogFormVisible" width="500px">
    <div>
      <el-form ref="dataForm" :model="dataForm" :rules="dataFormRules">
        <el-form-item label="快递单号" label-width="130px" prop="logisticsNum">
          <el-input v-model="dataForm.logisticsNum" autocomplete="off" style="width: 250px" />
        </el-form-item>
        <el-form-item label="物流公司" label-width="130px" prop="companyCode">
          <el-select v-model="dataForm.companyCode" placeholder="请选择物流公司">
            <el-option
              v-for="item in expressName"
              :key="item.code"
              :label="item.name"
              :value="item.name"
            />
          </el-select>
        </el-form-item>
      </el-form>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button size="mini" @click.native="closeDialog()">取消</el-button>
      <el-button size="mini" :loading="editLoading" type="primary" @click.native="saveFormData()">提交 </el-button>
    </div>
  </el-dialog>
</template>

<script>
import { sendOrder, saveMOrderLogistics, getCompanyList } from '@/api/modules/goodsOrder'
export default {
  name: 'Test',
  props: {
    // rowId: {
    //   type: [String],
    //   default: ''
    // },
    editVisiable: {
      type: [String],
      default: ''
    }
  },
  data() {
    return {
      websock: null,
      activeNames0: 'websock',
      editLoading: false, // 保存表单时loading框
      dialogSendVisible: false,
      dialogFormVisible: false,
      expressName: '',
      dataForm: {
        logisticsNum: '',
        companyCode: '',
        orderId: ''
      },
      // 表单检验规则
      dataFormRules: {
        logisticsNum: [{ required: true, message: '请输入快递单号', trigger: 'blur' }],
        companyCode: [{ required: true, message: '请选择物流公司', trigger: 'blur' }]
      }
    }
  },
  created() {
    console.log('create')

    this.getCompanyCodeList()
  },
  methods: {
    initDataForm() {
      this.dataForm = {
        id: '',
        orderId: '',
        logisticsNum: '',
        companyCode: '',
        createTime: '',
        updateTime: ''
      }
    },
    // 获取快递公司列表
    async getCompanyCodeList() {
      const res_c = await getCompanyList({ type: null })
      if (res_c.result != null) {
        this.expressName = res_c.result
      }
    },
    // 保存表单数据
    saveFormData() {
      this.$refs['dataForm'].validate((valid) => {
        // console.log(valid)
        if (!valid) {
          return false
        }
        this.editLoading = true
        this.dataForm.orderId = this.rowId
        saveMOrderLogistics(this.dataForm).then(res => {
        //   console.log(res)
          if (res.code === 0) {
            // console.log(this.dataForm.orderId)
            sendOrder({ id: this.rowId })
            this.dialogFormVisible = false
            // this.$parent.dialogFormVisible = false
            this.$parent.getList()
            console.log(this.dialogFormVisible)
            // console.log(this.dataForm)
            this.initDataForm()// 重置表单数据
            // console.log(this.dataForm)
            // this.getList()// 重新获取表格数据
            this.$notify({ title: '成功', message: '保存成功', type: 'success', duration: 2000 })
            this.editLoading = false// 关闭loading框
          }
        // window.close();
        })
      })
    },
    // g
    closeDialog() {
      this.dialogFormVisible = false
    //   this.$parent.closeDialog()
    }
  }
}
</script>
<style lang='less'>
</style>
